import React from 'react';
import {useState,useRef,useEffect,useCallback,useMemo} from "react";

function One(props) {
    // hooks函数的特点：
    // 1- 函数的名字以use开头。
    // 2- hooks函数只允许在函数组件或自定义hooks函数中调用。
    // 3- React提供的hooks函数可以解决：函数组件可以完成类组件的所有功能（函数组件拥有类组件的特性）
    // 类组件：拥有状态，拥有ref,拥有生命周期。
    // useEffect componentDidMount
    const [num,setNum] = useState(100)
    const divRef = useRef();
    return (
        <div>
            <button onClick={()=>{
                // setNum(200)
                console.log(divRef.current.innerText)
            }}>{num}</button>
            <p ref={divRef}>userName:{props.userName}</p>
        </div>
    );
}

export default One;